import { COLUMN_WIDTH } from '@/utils/service.js'
import { dateFormat } from '@/utils/date'

export const createColumns = (vm) => [
  {
    title: '序号',
    key: 'id',
    align: 'center',
    width: 80,
    render(h, params) {
      return <div>{(vm.formData.pageNo - 1) * vm.formData.pageSize + params.index + 1}</div>
    },
  },
  {
    title: '指令编号',
    key: 'ident',
    align: 'center',
    render(h, params) {
      return h(
        'router-link',
        {
          props: {
            to: { name: 'all_detailDirective', query: { f: 'detail', id: params.row.id, p: 'all' } },
          },
        },
        params.row.ident,
      )
    },
  },
  {
    title: '下发时间',
    align: 'center',
    render(h, params) {
      return <div>{dateFormat(params.row.startTime || '', 'YYYY.MM.DD')}</div>
    },
  },
  {
    title: '指令来源',
    align: 'center',
    render(h, params) {
      return <div>{(params.row.source && params.row.source.value) || ''}</div>
    },
  },
  {
    title: '指令类型',
    align: 'center',
    render(h, params) {
      return <div>{(params.row.type && params.row.type.value) || ''}</div>
    },
  },
  {
    title: '指令状态',
    align: 'center',
    render(h, params) {
      if (!params.row.state) return ''
      return <div class={'directive-' + params.row.state.key}>{params.row.state.value || ''}</div>
    },
  },
  {
    title: '指令到达率(完成/推送)',
    key: '',
    align: 'center',
    render(h, params) {
      return <div>{params.row.finishRate + '(' + params.row.finish + '/' + params.row.count + ')'}</div>
    },
  },
  {
    title: '操作',
    align: 'center',
    render(h, params) {
      const stateKey = params.row.state.key
      // 按钮的状态
      let btn1_state = true,
        btn2_state = true

      if (['FIRST_NOT_PASS', 'SECOND_NOT_PASS'].includes(stateKey)) {
        btn1_state = true
        btn2_state = true
      } else {
        btn1_state = false
        btn2_state = false
      }

      let btn_details = ''
      const perBtn_details = vm.hasPermission('instruct/execute/case')
      if (perBtn_details && params.row.detailStyle === 'PAGE') {
        btn_details = (
          <icon-button
            icon="directiveDetails_active"
            title="指令执行情况"
            class="mr15"
            activated={false}
            disabled={btn1_state}
            nativeOnClick={() => {
              vm.toDetails(params.row)
            }}
          ></icon-button>
        )
      } else if (perBtn_details && params.row.detailStyle === 'LIST') {
        btn_details = (
          <icon-button
            icon="viewFb_active"
            title="网站反馈情况"
            class="mr15"
            activated={false}
            disabled={btn1_state}
            nativeOnClick={() => {
              vm.toDetails(params.row)
            }}
          ></icon-button>
        )
      }
      return (
        <div>
          {btn_details}
          <icon-button
            icon={params.row.canAbort ? 'abort_active' : 'abort'}
            title="终止"
            activated={false}
            disabled={!params.row.canAbort || btn2_state}
            nativeOnClick={() => {
              vm.handleAbort(params.row)
            }}
          ></icon-button>
        </div>
      )
    },
  },
]
